<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DOM练习</title>
</head>
<body>
    <h1>我是标题:<span class="s"></span></h1>
    <button onclick="f1()">点</button>
    <br>


    <input type="text" id="i1">
    <input type="text" id="i2">
    <br>
    <button onclick="f2()">点</button>


    <script>
        function f1(){
            //根据类选择器找到span元素
            let spanE = document.querySelector('.s');
            //设置span元素内的显示内容
            //spanE.innerHTML = '哈哈哈';
            //spanE.innerHTML = '哈<mark>哈<mark>哈';
            spanE.innerHTML = '<table><tr><td>姓名：</td><td>年龄：</td></tr></table>';
        }

        function f2(){
            let input1 = document.querySelector('#i1');//根据id选择器获取元素
            let input2 = document.getElementById('i2')//根据id值获取元素
            console.log(typeof  input1.value);//从输入框中获取的内容是string类型
            console.log(input2.value);
            console.log(input1.value + input2.value);//类型转换
            console.log(i1,typeof i1);//'number'
        }
    </script>

</body>
</html>